<template>
	<view class="container">
		
		<uni-group mode="card" :is-shadow="false" v-for="(item, index) in formList" :key="index">
			<history-form :formJson="item.formJson"></history-form>
		</uni-group>
		
		<uni-group mode="card" :is-shadow="false" :title="this.dealFormData.nodeName">
			<current-form :formJson="formJson" :rules="rules" :modelValue="dealFormData" :showReject="creator != dealFormData.userId"></current-form>
		</uni-group>
	</view>
</template>

<script>
	import HistoryForm from '../components/historyForm.vue'
	import CurrentForm from '../components/currentForm.vue'
	import {
		getWorkFlowProcessList,
		getFlowProcessForm,
	} from "@/utils/api/api.js"
	
	import {
		transferFormData,
	} from "@/utils/utils.js"
	
	export default {
		data() {
			return {
				formList: [],
				workId: 0,
				// 表单数据
				dealFormData: {
					flowId: 0,
					processId: 0,
					tableName: '',
					isSave: 0,
					direction: 1,
					userId: uni.getStorageSync('userId'),
					orgId: uni.getStorageSync('orgId'),
				},
				rules: {},
				formJson: null,
				creator: 0,
			}
		},
		onLoad(options) {
			this.workId = options.workId;
			this.dealFormData.processId = options.processId;
			this.dealFormData.flowId = options.flowId;
			this.dealFormData.tableName = options.tableName;
			this.creator = options.creator;
		},
		onShow() {
			
		},
		onReady() {
			this.init()
		},
		components: {
			HistoryForm,
			CurrentForm
		},
		methods: {
            //第一次调用
			init() {
				if (this.workId){
					let data = {
						workId: this.workId
					}
					getWorkFlowProcessList(data).then(res => {
						if (res.code == 1) {
							res.data.forEach((item) => {
							  let historyFormJson = JSON.parse(item.form.jsonData);
							  let historyFormData = item.formData;
							  let widgetArr = []; // 表单组件数组，不包含grid、table、tab、card等组件
							  // 数据格式处理
							  transferFormData(historyFormData, historyFormJson.widgetList, widgetArr);
							  widgetArr.push({ "type":"input","icon":"text-field","formItemFlag":true,"options":
							  {"name":"inputSubmitter","label":"提交人","labelAlign":"","type":"text","defaultValue":item.form.submitterName,"columnWidth":"200px" }});
							  widgetArr.push({ "type":"input","icon":"text-field","formItemFlag":true,"options":
							  {"name":"inputSubmitTime","label":"提交时间","labelAlign":"","type":"text","defaultValue":item.form.submitTime,"columnWidth":"200px" }});
							  this.formList.push({formJson: widgetArr});
							});
						} else {
							uni.showToast({
								title: res.msg,
								duration: 2000,
								mask: true,
								icon: 'none'
							});
						}
					})
				}
				if (this.dealFormData.processId){
					let data = {
						processId: this.dealFormData.processId
					}
					getFlowProcessForm(data).then(res => {
						if (res.code == 1) {
							if (res.data && res.data.form && res.data.form.jsonData){
								this.dealFormData.tableName = res.data.form.tableName;
							    let widgetList = JSON.parse(res.data.form.jsonData).widgetList;
								let formData = res.data.formData ? res.data.formData : {};
								let widgetArr = [];
							
							    // 数据格式处理
							    transferFormData(formData, widgetList, widgetArr);
								this.formJson = widgetArr;
								this.formJson.forEach((s) => {
									this.dealFormData[s.options.name] = s.options.defaultValue;
									this.rules[s.options.name] = {
										rules: []
									}
									if (s.options.required){
										this.rules[s.options.name].rules.push({
											required: true,
											errorMessage: '不能为空'
										})
									}
								})
								// console.log("formJson", this.formJson)
							}
						} else {
							uni.showToast({
								title: res.msg,
								duration: 2000,
								mask: true,
								icon: 'none'
							});
						}
					})
				}
			},
		}
	}
</script>

<style>
	.container {
		font-size: 14px;
		line-height: 24px;
	}
</style>
